import React, {Component} from 'react';
import {Button, Upload} from 'element-react';
import axios from "axios";

class Test extends Component {
  constructor(props) {
    super(props);
    this.state = {
      fileList2: [
      ]
    }
  }


  handleRemove(file, fileList) {
    axios.delete('http://esjelly.com/student/home/index/delPic',{
      params:{
        name: file.name
      }
    })
        .then((res) => {
          this.getAllPic();
        })
        .catch((err) => {
          console.log(err)
        })
  }

  handlePreview(file) {
    alert("预览地址:" + file.url);
    console.log(file);
  }
  getAllPic() {
    axios.get("http://esjelly.com/student/home/index/getAllPic", {})
        .then((res) => {
          const fileList2 = res.data.picList.map(obj => obj);
          this.setState({ fileList2 })
        })
        .catch((err) => {
          console.log(err);
        })
  }

  render() {
    return (
        <div>
          <Upload
              key={Math.random()}
              className="upload-demo"
              action="http://esjelly.com/student/home/index/getPic"
              onPreview={file => this.handlePreview(file)}
              onRemove={(file, fileList) => this.handleRemove(file, fileList)}
              listType="picture"
              onSuccess = {this.success.bind(this)}
              fileList={this.state.fileList2}
              tip={<div className="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>}
          >
            <Button size="small" type="primary">点击上传</Button>
          </Upload>
        </div>
    )
  }
  componentDidUpdate () {
  }
  componentWillMount () {
  }
  componentDidMount() {
    this.getAllPic();
  }
  componentWillUnmount() {
    this.setState = (state, callback) => {
      return;
    };
  }
  success (res) {
    this.getAllPic();
  }

}

export default Test;